<template>
	<view>
		<view class="outView">
			<view class="row" v-for="(item,index) in goods" :key="index">
				<image class="image" :src="toShowImage(item.image[0])" mode="aspectFill" @click.stop="previewImage(item.image[0])"/>
				<view class="rightView" @click="toDetail(item)">
					<text class="name">{{item.name}}</text>
					<view class="price">
						<text class="left">￥</text>
						<text class="right">{{item.price.toLocaleString()}}</text>
					</view>
					<view class="address">
						<label class="left">所在地：</label>
						<text class="right">{{item.address}}</text>
					</view>
					
					<view class="createTime">
						<label class="left">发布时间：</label>
						<text class="right">{{item.create_time_fmt}}</text>
					</view>
				</view>
			</view>
		</view>
		<uni-load-more :status="loadMoreStatus"></uni-load-more>
	</view>
</template>

<script>
	import {findGoodsListByPage,showImage} from '@/apis/controll.js'
	
	export default {
		data() {
			return {
				pageInfo:{
					page:0,
					size:30,
				},
				pageParam:{
					name:'',
					address:'',
				},
				loadMoreStatus:"more",
				goods:[],
			}
		},
		onLoad() {
			this.toFindGoodsListByPage();
		},
		onPullDownRefresh() {
			this.pageInfo.page = 0;
			this.toFindGoodsListByPage();
		},
		onReachBottom() {
			if(this.loadMoreStatus=="more"){
				this.pageInfo.page++;
				this.toFindGoodsListByPage();
			}
		},
		methods: {
			toDetail(item){
				uni.navigateTo({
					url:'/pages/controll/goods/detail?id='+item.id
				})
			},
			previewImage(image){
				let imgsArray = [];
				imgsArray[0] = showImage(image.path+image.name);
				uni.previewImage({
					current: 0,
					urls: imgsArray
				});
			},
			toShowImage(image){
				return showImage(image.path+image.name)
			},
			toFindGoodsListByPage(){
				this.loadMoreStatus = "loading"
				findGoodsListByPage(this.pageParam,this.pageInfo).then(res=>{
					if (res?.result_code == "0") {
						if (res.data) {
							
							var content  = res.data.content;
							for(var i=0;i<content.length;i++){
								var image = JSON.parse(content[i].image);
								content[i].image = image
							}
							
							if(this.pageInfo.page=="0"){
								this.goods = content;
							}else{
								this.goods = [...this.goods,...content];
							}
							this.pageInfo = res.data.pageRequest;
							var total = res.data.total;
							
							if(this.goods.length>=total){
								this.loadMoreStatus = "noMore"
							}
						}
					}
					
					if(this.loadMoreStatus!="noMore"){
						this.loadMoreStatus = "more";
					}
					
					uni.stopPullDownRefresh();//下拉刷新时
				});
			}
		}
	}
</script>

<style lang="less" scoped>
	.outView{
		padding: 20rpx 10rpx;
		
		.row{
			display: flex;
			align-items: center;
			margin: 15rpx 0;
			
			.image{
				width: 200rpx;
				height: 200rpx;
				flex: none;
			}
			
			.rightView{
				height:200rpx;
				display: flex;
				flex-direction: column;
				margin-left: 20rpx;
				
				.name{
					color:#333333
				}
				.price{
					color: #FF6347;
					
					.left{
						font-size: 12px;
					}
					.rightView{
						font-size: 16px;
					}
				}
				.address{
					color: #565656;
					
					.left{
						font-size: 12px;
					}
					.right{
						font-size: 12px;
					}
				}
				.createTime{
					color: #7FB3D5;
					
					.left{
						font-size: 12px;
					}
					.right{
						font-size: 12px;
					}
				}
			}
		}
	}
</style>
